
// 每行几个格子
const colsPerRow = 10;
// 每页几行格子
const rowsPerPage = 11;

/**
 * 生成拼音
 */
function buildPy() {
    var pyInput = $.trim($("#content").val());
    // console.log("pyInput: " + pyInput);
    var py = cnchar.spell(pyInput, "array", "low", "tone"); // 小写，带音标声调
    // console.log("pinyin: " + py);
    var pyHtmlDiv = "";
    var rowCnt = 0;
    var lineFree = 0;

    for (let index = 0; index < py.length; index++) {
        // 每10行一个分页
        if (rowCnt > 0 && rowCnt % rowsPerPage == 0 && lineFree == 0) {
            // 分页打印标记点
            pyHtmlDiv = pyHtmlDiv + "<div class='pageEnd'></div>";
        }
        // 重置一个新行
        if (lineFree == 0) {
            lineFree = colsPerRow;
            rowCnt++;
        }

        // 判断是不是换行 
        if (pyInput[index] == String.fromCharCode(10)) {
            // 如果是正好在每行的第一个字是换行，则忽略此换行控制，所以也控制了忽略空行
            if (lineFree == colsPerRow) {
                continue;
            }
            // 换行，补足剩余空格
            for (; lineFree > 0; lineFree--) {
                pyHtmlDiv = pyHtmlDiv + "<dl><dt> </dt><dd> </dd></dl>"
            }
        } else {
            lineFree--;
            pyHtmlDiv = pyHtmlDiv + "<dl><dt title='" + pyInput[index] + "'>" + py[index] + "</dt><dd>" + pyInput[index] + "</dd></dl>"
        }
    }
    // 不足一行时，补足一行的格子
    if (lineFree > 0 && lineFree < colsPerRow) {
        for (; lineFree > 0; lineFree--) {
            pyHtmlDiv = pyHtmlDiv + "<dl><dt> </dt><dd> </dd></dl>"
        }
    }

    $('#pyShowDiv').css("color", $("#color").val());
    $("#pyShowDiv").html(pyHtmlDiv);
}

$(function () {
    //生成拼音
    $('#buildPy').click(buildPy);

    // 打印
    $('#printBt').click(function () {
        $("#pyShowDiv").print({
            manuallyCopyFormValues: false,
            title: '拼音生成器'
        });
    });

    // 删除或修改拼音
    $("#pyShowDiv").on("dblclick", 'dt', function () {
        // if ($.trim($(this).html()) == "") {
        //     return;
        // }
        var allPy = cnchar.spell($(this).attr("title"), 'poly', "low", "tone");
        var newPy = prompt("请输入这个字：" + $(this).attr("title") + allPy + "的新拼音（原值：" + $(this).html() + "）", $(this).html());
        if (newPy != null) {
            $(this).html(newPy);
        }
    });
    // 删除或修改汉字
    $("#pyShowDiv").on("dblclick", 'dd', function () {
        // if ($.trim($(this).html()) == "") {
        //     return;
        // }
        var newWord = prompt("请输入新的汉字（原值：" + $(this).html() + "）", $(this).html());
        if (newWord != null) {
            $(this).html(newWord);
        }
    });

});